<template>
  <div id="tbooking-policies">
    <nav aria-label="breadcrumb" role="navigation">
        <ol class="breadcrumb pb-1">
          <li class="breadcrumb-item">携程国际政策-自动比价</li>
          <span class="ms-auto" @click.stop="back()">返回</span>
        </ol>
    </nav>        
    <div class="card">
      <div class="card-body small py-1">
        <form class="" id="frmSearchPolicy">
            <div class="col-1">
                <select class="form-select" v-model.number="policyType">
                    <option value="1" selected>单程运价</option>
                    <option value="2" selected>往返运价</option>
                </select>
            </div>
            <div class="col-1">
                <select class="form-select" v-model="monitoring">
                    <option value="-1" selected>全部</option>
                    <option value="0">未监控</option>
                    <option value="1">监控中</option>
                </select>
            </div>
            <input type="textfield" class="form-control" placeholder="运价ID" size="10" v-model.trim="policyId">
            <input type="textfield" class="form-control" placeholder="航司" size="4" v-model.trim="carrier">
            <input type="textfield" class="form-control" placeholder="出发" size="4" v-model.trim="dport">
            <input type="textfield" class="form-control" placeholder="到达" size="4" v-model.trim="aport">

            <div class="col-1">
                <button type="button" class="btn btn-primary ms-2" @click.stop="search()">查找</button>
				        <button type="button" class="btn btn-secondary btn-sm ms-1" @click.stop="reset()">重置</button>

                <button type="button" class="btn btn-success btn-sm ms-3" @click.stop="syncPolicy()">同步</button>

            </div>        
                <button type="button" class="btn btn-danger btn-sm ms-auto" @click.stop="config()">参数</button>
        </form>      	
      </div>
    </div>
    <table class="table table-sm table-striped table-hover small">
      <thead>
  	    <tr>
  	        <th></th>
  	        <th>运价ID</th>
  	        <th>航空公司</th>
  	        <th>出发机场</th>
  	        <th>到达机场</th>
  	        <th>
              <template v-if="policyType === 1">
                去程旅行日期
              </template>
              <template v-else>
                回程旅行日期
              </template>
            </th>
  	        <th>舱位</th>
  	        <th>销售价</th>
            <th>返点</th>
            <th>留钱</th>
  	        <th>监控时间</th>
            <th>底价</th>
  	        <th>注释</th>
  	        <th></th>
  	    </tr>
  	  </thead>
	    <tbody>
        <template v-for="(info, index) in dataList">
      <tr :key="info.id">
        <td>
          <button type="button" @click.stop="localDelete(info.id)">本地删除</button>
        </td>
        <td>{{info.fareId}}</td>
        <td>
            {{info.owner}}</a>
        </td>
        <td>{{info.departCity}}</td>
        <td>{{info.arriveCity}}</td>
        <td>
          <template v-if="policyType === 1">
            {{info.fcOutboundTravelDate}}  
          </template>
          <template v-else>
            {{info.fcInboundTravelDate}}
          </template>
          
        </td>
        <td>          
            {{info.routingClass}}
        </td>
        <td>
            {{info.salesPrice}}</a>
        </td>
        <td>
            {{info.commission}}</a>
        </td>
        <td>
            {{info.profit}}</a>
        </td>
        <td>{{info.monitorTime}}</td>
        <td>{{info.bottomPrice}}</td>
        <td>{{info.remark}}</td>
        <td>
          <button type="button" class="btn btn-sm btn-primary" @click.stop="showBijiaOption(index)">设置</button> 
          <template v-if="info.monitoring">            
            监控中
            <button type="button" class="btn btn-sm btn-danger ms-1" @click.stop="stopMonitorPolicy(info.id)">停止</button>
          </template>
          <template v-else>
            <button type="button" class="btn btn-sm btn-success ms-1" @click.stop="startMonitorPolicy(info.id)">开始监控</button>
          </template>
        </td>
        </tr>      
      </template>
    </tbody>
    </table>
          
    <nav id="pagination-box" class="float-end">
      <my-pagination name='pagination' :row-count='sc.rowCount' :page-total='sc.pageTotal' :page-no='sc.pageNo' @next-page='nextPage' @prev-page='prevPage' @direct-page='directPage'></my-pagination> 
    </nav>

    <my-modal-prompt ref="modalPrompt" :nullable="modalNullable">
      <span slot="title">{{modalTitle}}</span>
    </my-modal-prompt>
    <modal-fare-bijia ref="modalBijia"></modal-fare-bijia>
    
    <modal-common-update ref="modalUpdateConfig">
      <span slot="title">国际机票平台API参数</span>
      <span slot="label1">用户ID</span>
      <span slot="label2">口令</span>
    </modal-common-update>    
  </div>
</template>

<script>
import {
  searchIntlOwFares,
  searchIntlRtFares,
  syncIntlFares,
  localDeleteIntlFare,
  startMonitorIntlFare,
  updateIntlFareMonitorParams,
  updateApiParams,
} from "@/api/tbooking.js";
import MyPagination from "@/components/my-pagination.vue";
import MyModalPrompt from "@/components/modal/my-modal-prompt.vue";
import MyDatePicker from "@/components/my-datepicker.vue";
import ModalFareBijia from "@/components/tbooking/modal-intl-fare-bijia.vue";
import ModalCommonUpdate from "@/components/modal-common-update.vue";

export default {
  components: {
    MyDatePicker,
    MyPagination,
    MyModalPrompt,
    ModalFareBijia,
    ModalCommonUpdate,
  },
  data() {
    return {
      dataList: [],

      sc: {
        rowCount: 0,
        pageNo: 1,
        pageSize: 20,
        pageTotal: 0,
      },

      policyType: 1,
      policyId: "",
      monitoring: -1,

      carrier: "",
      dport: "",
      aport: "",
      policyCode: "",

      modalTitle: "",
      modalNullable: false,
    };
  },
  watch: {
    policyType: function (newVal, oldVal) {
      // console.log(newVal + ", " + oldVal + ": " + this.policyType)
      this.search();
    },
  },
  mounted: function () {
    this.search();
  },
  methods: {
    back: function () {
      this.$router.go(-1);
    },
    showErrMsg: function (msg, msgType) {
      this.$store.dispatch("showAlertMsg", {
        errMsg: msg,
        errMsgType: msgType,
      });
    },
    showLoading: function (loadingText) {
      this.$store.commit("showLoading", {
        loading: true,
        loadingText: loadingText,
      });
    },
    hideLoading: function () {
      this.$store.commit("showLoading", { loading: false });
    },
    search: function () {
      let policyId0 = 0;
      const x = parseInt(this.policyId);
      if (isNaN(x) === false) {
        policyId0 = x;
      }
      const params = {
        "sc.pageNo": this.sc.pageNo,
        "sc.pageSize": this.sc.pageSize,
        "sc.policyType": this.policyType,
        "sc.monitoring": this.monitoring,
        "sc.policyId": policyId0,
        "sc.carrier": this.carrier,
        "sc.departureAirport": this.dport,
        "sc.arrivalAirport": this.aport,
      };

      this.showLoading();

      if (this.policyType === 1) {
        searchIntlOwFares(
          params,
          (v) => {
            this.dataList = v.dataList;
            this.sc = v.page;
          },
          () => {
            this.hideLoading();
          }
        );
      } else {
        searchIntlRtFares(
          params,
          (v) => {
            this.dataList = v.dataList;
            this.sc = v.page;
          },
          () => {
            this.hideLoading();
          }
        );
      }
    },
    startMonitorPolicy: function (id) {
      const params = {
        id,
        policyType: this.policyType,
        monitoring: 1,
      };

      this.showLoading();

      startMonitorIntlFare(
        params,
        (v) => {
          if (v.status === "OK") {
            this.showErrMsg("操作成功");
            this.search();
          } else {
            this.showErrMsg(v.errmsg, "danger");
          }
        },
        () => {
          this.hideLoading();
        }
      );
    },
    stopMonitorPolicy: function (id) {
      const params = {
        id,
        policyType: this.policyType,
        monitoring: 0,
      };

      this.showLoading();

      startMonitorIntlFare(
        params,
        (v) => {
          if (v.status === "OK") this.showErrMsg("操作成功");
          this.search();
        },
        () => {
          this.hideLoading();
        }
      );
    },
    syncPolicy: function () {
      const params = {
        policyType: this.policyType,
        "sc.carrier": this.carrier,
        "sc.policyCode": this.policyCode,
      };

      this.showLoading();
      syncIntlFares(
        params,
        (v) => {
          if (v.status === "OK") {
            this.showErrMsg("同步成功");
            this.search();
          } else {
            this.showErrMsg(v.errmsg, "danger");
          }
        },
        () => {
          this.hideLoading();
        }
      );
    },
    localDelete: function (id) {
      const params = {
        id: id,
        policyType: this.policyType,
      };

      this.showLoading();

      localDeleteIntlFare(
        params,
        (v) => {
          if (v.status === "OK") {
            this.showErrMsg("操作成功");
            this.search();
          } else {
            this.showErrMsg(v.errMsg, "danger");
          }
        },
        () => {
          this.hideLoading();
        }
      );
    },
    showBijiaOption: function (index) {
      const info = this.dataList[index];

      this.$refs.modalBijia
        .modal(this.policyType, info)
        .then((params) => {
          updateIntlFareMonitorParams(info.id, params, (v) => {
            if (v.status === "OK") {
              this.showErrMsg("保存成功");
              this.search();
            } else {
              this.showErrMsg(v.errmsg);
            }
          });
        })
        .catch((ex) => {});
    },
    config: function () {
      this.$refs.modalUpdateConfig
        .modal("", "")
        .then((v) => {
          const params = {
            userId: v.field1,
            userKey: v.field2,
          };

          console.log(params);

          updateApiParams(params, (v) => {
            if (v.status === "OK") {
              this.showErrMsg("保存成功");
            } else {
              this.showErrMsg(v.errmsg);
            }
          });
        })
        .catch((ex) => {});
    },
    deleteAll: function () {
      this.modalTitle = "全部删除?";
      this.$refs.modalPrompt
        .modal("YesOrNo")
        .then(() => {
          deleteAllLocalPolicy((v) => {
            console.log(v);
            if (v.status === "OK") {
              this.showErrMsg("删除成功");
              this.search();
            }
          });
        })
        .catch((ex) => {});
    },
    reset: function () {
      this.sc.pageNo = 1;
      this.policyId = "";
      this.carrier = "";
      this.dport = "";
      this.aport = "";
    },
    prevPage: function () {
      this.sc.pageNo = this.sc.pageNo - 1;
      if (this.sc.pageNo < 1) this.sc.pageNo = 1;
      this.search();
    },
    nextPage: function () {
      this.sc.pageNo = this.sc.pageNo + 1;
      this.search();
    },
    directPage: function (pageNo) {
      this.sc.pageNo = pageNo;
      this.search();
    },
  },
};
</script>